<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <title><span th:text="#{pageTitle}" th:remove="tag"></span></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

    <link rel="stylesheet" type="text/css" href="css/index.css"/>
    <script type="text/javascript">

        //@formatter:off
        //  var globalParams = <span th:utext='${globalObj}' th:remove='tag'></span>;
         var globalParams = <span th:utext='${globalObj}' th:remove='tag'></span>;
        //@formatter:on
        //  define jqgrid i18n suffix and locale mapping
        (function () {
            var jqGridI18nMap = {
                'zh-cn': 'cn',
                'en-us': 'en'
            };
            globalParams.jqgridI18nSuffix = jqGridI18nMap[globalParams.locale];
            return true;
        }).call(globalParams);

    </script>

    <script type="text/javascript" async="async" data-main="js/entry" src="/webjars/requirejs/2.2.0/require.min.js"/>
    <!--
        how to use webjar: http://www.jamesward.com/2014/02/19/official-support-for-requirejs-in-webjars
    -->
</head>
<body>
<!--<dd th:text="#{title}"></dd>-->
<div style="margin-bottom: 15px">
    <!--
    http://blog.codeleak.pl/2015/09/placeholders-support-in-value.html
    -->
    <div style="float:left; margin-right: 200px;vertical-align: middle; height: 30px"
         th:text="|#{platform} A(OXE1) IP: ${@environment.getProperty('oxeserver.oxe1.host')} , #{platform} B(OXE2) IP: ${@environment.getProperty('oxeserver.oxe2.host')}|">
        <span th:text="#{oxeInfo}"></span>
    </div>
    <!--<span th:text="#{title(${@environment.getProperty('currentsite')})}"></span>-->
    <div>
        <button id="allTo-1" th:text="#{allToA}"></button>
        <button id="allTo-2" th:text="#{allToB}"></button>
    </div>
</div>
<div class="center">
    <div id="phoneListArea">
        <table id="phoneGrid"></table>
        <div id="phoneGridPager"></div>
        <br/>

        <div>
            <div id="progressbar">
                <div class="progress-label"></div>
            </div>
            <button id="startSwitch" th:text="#{instantSwitch}"></button>
            <button id="resetState" th:text="#{resetState}"></button>
        </div>
    </div>
    <br/><br/>

    <div id="taskArea">
        <table id="taskGrid"></table>
        <div id="taskGridPager"></div>
    </div>
</div>
</body>
</html>
